{extend name='admin@main'}

{block name="button"}

{if auth("add")}

{/if}

{if auth("remove")}

{/if}

{/block}

{block name="content"}
{php}
{//var_dump($userinfo);}
{/php}
<style type="text/css">
     .layui-show{margin-left: 140px;}
     .ybimage{width: 100% !important;}
     .idcardimage{width: 50% !important; max-width: 50%;}
     .uploadimage{
      background-image: url("__ROOT__/static/theme/img/upyyzz.png");
      background-repeat: no-repeat;
      width: 140px;
      height: 140px;
     }
     .uploadimage:hover {
      cursor:pointer;
      background-image: url("__ROOT__/static/theme/img/hupyyzz.png");
     }
     .upload-image-box {
        width: 130px;
        height: 90px;
        border: 1px solid rgba(125, 125, 125, .1);
        background: url("__ROOT__/static/theme/img/yyzz.png") no-repeat center center;
        background-size: cover;
    }
    .layui-form-label{
      width: unset;
    }
    .layui-form-item{
      margin-bottom: 30px;
    }
/*    .disbale-box{
      z-index: 99999;
      opacity: 0.3;
      position: absolute;
      width: 100%;
      height: 20%;
      background-color: #bdbdbd;
      text-align: center;
    }
    .disbale-box .disbale-minbox{
      font-weight: 400;
      font-size: 4rem;
      margin: 100px;
    }*/
    .newimg_1l{border:1px solid #e6e6e6;min-height:8rem;position:relative;margin-bottom:10px;border-radius: 8px;}
    .showaddico{position: absolute;top:35%;width:100%;text-align:center;}

    .showaddico .layui-icon{font-size:2.5rem;color:#06C}
    .showaddico .uploadico_text{color:#06C;}
    .newimg_1l .thisnoimg{width:100%;text-align:center;opacity:0.5;border-radius: 4px;}
    .newimg_1l .thisnoimg:hover{opacity:1;}
    .newimg_1l .thisnoimg img{height:100%}
     .newimg_1l .thisshowimg{width:100%;text-align:center;border-radius: 4px;}
     .newimg_1l .thisshowimg:hover,.showaddico:hover{
      cursor:pointer;
     }
     .newimg_1l .thisshowimg img{height:100%;width: 50%;}
     .newimg_1l .delimg{position:absolute;right:5px;top:5px;z-index: 1;}
     .newimg_1l .delimg .layui-icon{font-size:1.5rem;color:#06C;}
     #layui-icon-close-fill{transform:rotate(45deg);}
   /*  .layui-icon-delete:hover{color: red;}*/
     .auditing{

      text-align: center;
      position: absolute;
      top: 20%;
      left: 25%;
      background-color: #fff;
     }
     .auditing-dialog{
      width: 30%;
      height: 230px;
     }
     .auditing-tips{
        margin-top: 25%;
        margin-bottom: 25%;
     }
     .auditing-tips .auditing-sm-box{
        
     }
     .container-auditing-box{display: none;}
     .gray {     
 -webkit-filter: grayscale(100%);   
  -moz-filter: grayscale(100%);  
   -ms-filter: grayscale(100%);   
  -o-filter: grayscale(100%);     
     filter: grayscale(100%);        
 
filter: gray; }
</style>
<div class="think-box-shadow" style="height: 100%">
{php}
{//var_dump($userinfo);}
{/php}
<div class="layui-container container-auditing-box">
  
    <div class="layui-row">

    <div class="layui-col-md12">
      
      <div class="auditing-tips text-center">
        <div class="auditing-sm-box">
      <i class="layui-icon" style="font-size: 100px; color: #f3f3f3;">&#xe6b2;</i>  
      <p class="font-w6 font-s16 margin-right-10">审 核 中</p>
    </div>
    </div>
    </div>
    </div>

</div>
<div class="layui-container container-big-box">  
  
  <div class="layui-row">

    <div class="layui-col-md12">
      <div class="text-left">
      <h1>实名认证</h1>
        <hr>
    </div>
  <div class="layui-tab-content">

    <div class="layui-tab-item layui-show">

<form id="personcard-form" action="{:url('personal/upload')}" onsubmit="return false;"  method="post" enctype="multipart/form-data">

  <div class="layui-card-body padding-left-40">


<div class="layui-form-item">
    <div class="layui-col-md7">
     <div class="layui-form-item">
    <label class="layui-form-label label-required">上传证件</label>
    <div class="layui-input-block">
        <div class="newimg_1l" id="idcarz">
            <div  style="display: none;">
                       <input name="uploadidcardz" type="hidden" value="{$vo.logo|default=''}">
          <script>$('[name="uploadidcardz"]').uploadOneImage()</script>
            </div>
            <!--删除按钮-->
            <div class="delimg"> 
                <i class="layui-icon layui-icon-delete"></i>
            </div>
            <!--有图片状态-->
           
           <!--没有图片状态-->
        
          
                {if @$userinfo['db2']['imgurl']}
                {php}

                   {
                  //路径1
                    if (strstr($userinfo['db2']['imgurl'],'http://pc.zsicp.com')){
                        echo  "<div id='normalupimg' class='thisshowimg'> <img data-tips-image class='idcardimage' src=".$userinfo['db2']['imgurl']."></div>";
                    }else{
                  //路径2
                        echo "<div id='normalupimg' class='thisshowimg'><img data-tips-image class='idcardimage' data-tips-image src="."http://devs.zsicp.com/public/upload/business_license/".$userinfo['db2']['imgurl']."></div>";   
                    }
                
                    }
                {/php}

                {else}
                <!-- none --> 
                <div id='normalupimg' class='thisnoimg gray'><img data-tips-image class='ybimage' src='__ROOT__/static/theme/img/sfzybf.png'></div>
            {/if}
    
    
        
           <!--上传按钮-->
           <div class="showaddico">
               <div id="layui-icon-close-fill">
               <i class="layui-icon layui-icon-close-fill"></i>
             </div>
               <div class="uploadico_text padding-top-10">
                   请上传证件照正面
               </div>
           </div>
        </div>
        <div>请JPG，PNG，BMP，GIF格式。</div>
    </div>

<!-- -----反面 -->
<div class="maing-top-10"></div>
<!-- 反面 -->
   <div class="layui-input-block">
        <div class="newimg_1l" id="idcarf">
            <div  style="display: none;">
                       <input name="uploadidcardf" type="hidden" value="{$vo.logo|default=''}">
          <script>$('[name="uploadidcardf"]').uploadOneImage()</script>
            </div>
            <!--删除按钮-->
            <div class="delimg"> 
                <i class="layui-icon layui-icon-delete"></i>
            </div>
            <!--有图片状态-->
           
           <!--没有图片状态-->
        
          
                {if @$userinfo['db2']['imgurl']}
                {php}

                   {
                  //路径1
                    if (strstr($userinfo['db2']['imgurl'],'http://pc.zsicp.com')){
                        echo  "<div id='normalupimg' class='thisshowimg'> <img data-tips-image class='idcardimage' src=".$userinfo['db2']['imgurl_b']."></div>";
                    }else{
                  //路径2
                        echo "<div id='normalupimg' class='thisshowimg'><img data-tips-image class='idcardimage' data-tips-image src="."http://devs.zsicp.com/public/upload/business_license/".$userinfo['db2']['imgurl_b']."></div>";   
                    }
                
                    }
                {/php}

                {else}
                <!-- none --> 
                <div id='normalupimg' class='thisnoimg gray'><img data-tips-image class='ybimage' src='__ROOT__/static/theme/img/sfzybz.png'></div>
            {/if}
    
    
        
           <!--上传按钮-->
           <div class="showaddico">
               <div id="layui-icon-close-fill">
               <i class="layui-icon layui-icon-close-fill"></i>
             </div>
               <div class="uploadico_text padding-top-10">
                   请上传证件照反面
               </div>
           </div>
        </div>
        <div>请JPG，PNG，BMP，GIF格式。</div>
        <div>为避免审核失败,请上传清晰、平铺、无反光、无遮边的证件照片</div>
    </div>


  </div>
 </div>
  
  
</div>
 <div class="layui-col-md7">

     <div class="layui-form-item">
    <label class="layui-form-label">真实姓名</label>
    <div class="layui-input-block">
      {if @$userinfo['db2']}
        <input readonly type="text" name="name" required  lay-verify="required" value="{$userinfo['db2']['name']|default=''}" autocomplete="off" class="layui-input">
      {else}
        <input placeholder="真实姓名" readonly type="text" name="name" required  lay-verify="required"  autocomplete="off" class="layui-input">
      {/if}
      
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">性别</label>
    <div class="layui-input-block">
      <select  class="layui-input layui-select select-sex" name="sex" lay-verify="required">
        {foreach ['0'=>"未知",'1'=>"男",'2'=>"女"] as $key=>$val}
        {if $userinfo['db2']}
            {if $userinfo['db2']['sex']==$key}
                <option selected value="{$key}">{$val}</option>
              {else}
                 <option  value="{$key}">{$val}</option>
             {/if}
          {else}
              <option  value="{$key}">{$val}</option>
          {/if}
      
       {/foreach}
      </select>
    </div>
  </div>

       <div class="layui-form-item">
    <label class="layui-form-label">证件类型</label>
    <div class="layui-input-block">
       
                <input readonly type="text" name="card_type" required  lay-verify="required"  value="居民身份证" autocomplete="off" class="layui-input">
          
    </div>
  </div>

       <div class="layui-form-item">
    <label class="layui-form-label">身份证号码</label>
    <div class="layui-input-block">
              {if @$userinfo['db2']}
                <input placeholder="证件号码" readonly type="text" name="identitycard" required  lay-verify="required"  value="{$userinfo['db2']['identitycard']|default=''}" autocomplete="off" class="layui-input">
              {else}
               <input placeholder="证件号码" readonly type="text" name="identitycard" required  lay-verify="required"  value="" autocomplete="off" class="layui-input">
              {/if}
    </div>
  </div>
         <div class="layui-form-item">
    <label class="layui-form-label">出生日期</label>
    <div class="layui-input-block">
          {if @$userinfo['db2']}
                <input type="text" class="layui-input" id="birth" name="birthday" value="{$userinfo['db2']['birthday']|default=''}">      
          {else}
                <input type="text" class="layui-input" id="birth" name="birthday" value="{$Think.get.birthday|default=''}"  placeholder="请选择出生日期">      
          {/if}
            </div>

    </div>
  </div>
<!--      <div class="layui-form-item">
    <label class="layui-form-label">有效期</label>
    <div class="layui-input-block">
                   <select name="idcarddate" lay-verify="required">
        <option value=""></option>
        <option value="0"></option>
        <option value="1">男</option>
        <option value="2">女</option>
      </select>
      
    </div>
  </div> -->

    <input type='hidden' value='update' name='personcardtype'>
     <div class="layui-form-item sub-box">
    <div class="layui-input-block">
      <span style="color: #FF5722;">提交后耐心等待至认证通知</span>
      <br>

      <button class="layui-btn personcardsub-btn" lay-submit lay-filter="formDemo">立即提交</button>
     <button class="layui-btn layui-btn-normal personcardupdate-btn" lay-filter="upformDemo">修 改</button>

    </div>
  </div>


</div>
</form>




</div>
<!--     <div class="layui-tab-item">4</div>
    <div class="layui-tab-item">5</div>
    <div class="layui-tab-item">6</div> -->
  </div>
    </div>
  </div>

</div>
<script type="text/javascript">
layui.use(['laydate','form'], function(){
  var laydate = layui.laydate;
      var form = layui.form;
    var  layer = layui.layer;
      laydate.render({
    elem: '#birth' //指定元素
  });
    });
      require(['angular', 'ckeditor'], function () {

        var $form = $('form[name="news"]');
        var $vali = $form.vali().data('validate');

        // var editor = window.createEditor('[name="content"]');

        var app = angular.module("NewsEditor", []).run(callback);
        angular.bootstrap(document.getElementById(app.name), [app.name]);
        //检测审核
        var personinfo = eval("{$userinfo['db2']['id']}")
        if(personinfo){
          //
          var idcarz_is = "{$userinfo['db2']['imgurl']}"
          var idcarf_is = "{$userinfo['db2']['imgurl_b']}"
          if(idcarz_is!="" || idcarf_is!=""){
            $('#idcarz .showaddico').css({'display':'none'})
            $('#idcarf .showaddico').css({'display':'none'})
            $('.personcardsub-btn').css({'display':'none'})
          }
  //         if(is_auditing===0){
  //           $('.container-auditing-box').css({'display':'block'})
  //           $('.container-big-box').css({'display':'none'})

  //       var auditing_str =    '<div class="auditing layui-anim-fadein">'+
  //       '<h2 class="font-w7">营业执照审核</h2>'+
  //       '<p class="margin-20 font-s12">您已提交营业执照审核申请,我们将在1-3个工作日内审核。</br> 审核通过后您可直接登录系统,如审核不通过,请修改信息后提交</p>'+
  //       '</div>';

  //      layer.confirm(auditing_str, {
  //         area: ['700px', '240px'],
  //   // icon: 1, 
  //         title:'提示'}, function(index){
  // //do something
  
  //         layer.close(index);
  //       });
  //         }
          //检测图片
          var companyinfo_yyzz_img = "{$userinfo['db2']['imgurl']}"
          if(companyinfo_yyzz_img){
            $('#newimg_yyzz .showaddico').css({'display':'none'})
          }
        }
        //上传按钮
        $('.showaddico').on('click',function(){
            var fater_parent = $(this).parent().attr('id')
            console.log(fater_parent)
            //正面
            if(fater_parent =='idcarf'){
             $('#'+fater_parent+' .uploadimage').click();
            }
            
            //反面
            if(fater_parent =='idcarz'){
              $('#'+fater_parent+' .uploadimage').click();
            }            

        });

        //删除按钮
        $('.delimg').on('click',function(){
            var fater_parent = $(this).parent().attr('id')
            return $.msg.confirm('删除并重新上传身份证件?',function(okres){
              $('#'+fater_parent+' #normalupimg img').removeClass('thisnoimg')
              $('#'+fater_parent+' #normalupimg img').removeClass('thisshowimg')
              $('#'+fater_parent+' #normalupimg img').removeClass('ybimage')
              $('#'+fater_parent+' #normalupimg img').removeClass('idcardimage')

              //反面
              if(fater_parent =='idcarf'){
                $('#'+fater_parent+' #normalupimg img').attr('src',"__ROOT__/static/theme/img/sfzybz.png")
                $('input[name="uploadidcardf"]').val('')
              }
              //正面
              if(fater_parent =='idcarz'){
                $('#'+fater_parent+' #normalupimg img').attr('src',"__ROOT__/static/theme/img/sfzybf.png")
                $('input[name="uploadidcardz"]').val('')
                  $(':input','#personcard-form').not(':button,:submit,:reset,:hidden').val('').removeAttr('checked').removeAttr('checked')
              }   
            
                $('#'+fater_parent+' #normalupimg img').addClass('thisnoimg')
                $('#'+fater_parent+' #normalupimg img').addClass('ybimage')
                $('#'+fater_parent+' .showaddico').css({'display':'block'})
                //手动关闭 全局没
                $.msg.close(okres);
            });
        })
        //监听修改按钮
        $('.personcardupdate-btn').on('click',function(){
            $('.personcardsub-btn').css({'display':'unset'})
            $("input[name='name']").attr('readOnly',false).focus()
            //$("input[name='card_type']").attr('readOnly',false)
            $('input[name="identitycard"]').attr('readOnly',false)
            // $('input[name="corporation"]').attr('readOnly',false)
            // $('input[name="code"]').attr('readOnly',false)
            // $('input[name="title"]').attr('readOnly',false)
            
          });
        //反面
        $('input[name="uploadidcardf"]').change(function(res){
          console.log(res.target.defaultValue)
          $('#idcarf #normalupimg img').attr('src',$('input[name="uploadsq"]').val())
          //待上传接口
          $('#idcarf #normalupimg img ').attr('src',res.target.defaultValue)
          $('#idcarf .showaddico').css({'display':'none'})
          $('#idcarf #normalupimg img').removeClass('ybimage')
          $('#idcarf #normalupimg img').removeClass('thisnoimg')
          $('#idcarf #normalupimg img').addClass('idcardimage')

        });
        //正面
        $('input[name="uploadidcardz"]').change(function(res){
          console.log(res)
          postData = {};
          var imgurlvalue = $('input[name="uploadidcardz"]').val()

          var companyinfoid = eval('{$userinfo["db2"]["id"]}')

          if(companyinfoid){ }
            
           
            
            postData['uptype'] = 'url';
            postData['url'] = imgurlvalue;
            gorqeuest('idcarz',postData)
            console.log(postData)

          })
        //监听开关
        form.on('switch(ye_switch)', function(data){
            console.log(data.elem); //得到checkbox原始DOM对象
        // 　　console.log(data.elem.checked); //开关是否开启，true或者false
        // 　　console.log(data.value); //开关value值，也可以通过data.elem.value得到
        // 　　console.log(data.othis); //得到美化后的DOM对象
            if(data.elem.checked){

                $('.upload_yye').css({'display':'none'});
             }else{
                $('.upload_yye').css({'display':'block'});
                }
        });
        $("input[name='type']").change(function(data){
           var radioval = $('input[name="type"]:checked').val();
           console.log(radioval)
           if(radioval == 2 || radioval == 3 ){
                $('#ch-company-type').css({'display':'none'});
           }else{
                $('#ch-company-type').css({'display':'block'});
           }

        })
        /**身份信息提交**/
        $('.personcardsub-btn').on('click',function(){

          
          var data = $("#personcard-form").serializeArray();
          console.log(data)
          postData = {};
          $(data).each(function(i) {
            
            postData[this.name]= this.value;

          });
          
          // postData["local_url"] =  $('#NewsEditor img').attr('src')
          
          // postData['personcardtype']= 'update';
          console.log(postData)

          if((postData['uploadidcardz']=="" || postData['uploadidcardf']=="") && ($('#idcarz #normalupimg img').attr('src')=="" || $('#idcarz #normalupimg img').attr('src')=="/static/theme/img/sfzybf.png")){
            $.msg.error("请上传身份证件");
            return
          }
          if(postData['uploadidcardz']=="" || postData['uploadidcardf']==""){
            postData['uploadidcardz'] = $('#idcarz #normalupimg img').attr('src')
            postData['uploadidcardf'] = $('#idcarf #normalupimg img').attr('src')

          }

          $.post("{:url('personal/personal/personverif')}",postData, function(result) {
                //result = JSON.parse(result)
                console.log(result)
                if (result.code == 200) {
                    //成功
                    //
                    //
                    //
                    //
                    $('.container-auditing-box').css({'display':'block'})
                    $('.container-big-box').css({'display':'none'})

                    var auditing_str =    '<div class="auditing layui-anim-fadein">'+
                                          '<h2 class="font-w7">实名认证</h2>'+
                                          '<p class="margin-20 font-s12">您已提身份证件审核申请,我们将在1个工作日内审核。</br> 审核通过后您可直接登录系统,如审核不通过,请修改信息后提交</p>'+
                                          '</div>';

                    layer.confirm(auditing_str, {
                        area: ['700px', '240px'],
                  // icon: 1, 
                        title:'提示'}, function(index){
                //do something
                        layer.close(index);
                      });
                    //
                    //
                    //
                    //
                    $('.sub-box').css({'display':'none'})
                    return $.msg.success(result.info);
                } else if (result.code == 400) {
                    // 失败
                    return $.msg.error(result.info);
                }
          }, "JSON");

        })
        //tpl  id = xxx requestdata 请求数据
        function gorqeuest(tpl,requestdata){
          $.post("{:url('admin/user/upload_postidcard')}",requestdata , function(result) {
            if(typeof(result)=='string'){
              result = JSON.parse(result)
            }
            
            console.log(result)
            if (result.code == 200) {
                //成功
                if(tpl=='idcarz'){
                  console.log(result)
                  $('#idcarz #normalupimg img ').attr('src',result.data.src)
                  $('#idcarz .showaddico').css({'display':'none'})
                  $('#idcarz #normalupimg img').removeClass('ybimage')
                  $('#idcarz #normalupimg img').removeClass('thisnoimg')
                  $('#idcarz #normalupimg img').addClass('idcardimage')

                  $('input[name="name"]').val(result.data.name)
                  $(".select-sex").val(result.data.sex=='男'?1:2)
                  console.log(result.data.sex=='男'?1:2)
                  //$('input[name="sex"]').val(result.data.sex=='男'?1:2)
                  $('input[name="identitycard"]').val(result.data.identitycard)

                  $('input[name="birthday"]').val(result.data.birth)
                  $('input[name="card_type"]').val('居民身份证')



                }
                if(tpl=='idcarf'){

                }
                // $('input[name="title"]').val(result.data.name)
                // $('input[name="code"]').val(result.data.code)
                // $('input[name="address"]').val(result.data.address)
                // $('input[name="corporation"]').val(result.data.corporation)
                // $('#NewsEditor img').attr('src',result.src)

                // $('.ybimage').attr('src',result.src)
                // $('.showaddico').css({'display':'none'})
                // $('#uploadyb').removeClass('thisnoimg')
                // $('#uploadyb').addClass('thisshowimg')

                return $.msg.success(result.info);
            } else if (result.code == 400) {
                // 失败
                return $.msg.error(result.info);
            }
                }, "JSON");
        }
        //
        function callback($rootScope) {
            $rootScope.list = [];
            $rootScope.item = {};

            $rootScope.setItemValue = function (name, value) {

                $rootScope.item[name] = value;
                $rootScope.item.style = "background-image:url('" + $rootScope.item.local_url + "')";
                  };


            $('[name="local_url"]').on('change', function () {
                var value = this.value;
                $rootScope.$apply(function () {
                    $rootScope.setItemValue('local_url', value);
                });
            });
        }
    });
</script>
{/block}
